
<template>
    <div id="state-config">
        <el-tabs v-model="statenum" @tab-click="changeStatement">
            <el-tab-pane label="会员注册条款" name="1">
                <StatementInput v-if="statenum=='1'"
                                :statetype="statenum"
                ></StatementInput>
            </el-tab-pane>
            <el-tab-pane label="隐私保护申明" name="2">
                <StatementInput  v-if="statenum=='2'"
                                 :statetype="statenum"
                ></StatementInput></el-tab-pane>
            <el-tab-pane label="在线认购协议" name="3">
                <StatementInput v-if="statenum=='3'"
                                :statetype="statenum"
                ></StatementInput></el-tab-pane>
            <el-tab-pane label="优惠券服务协议" name="4">
                <StatementInput v-if="statenum=='4'"
                                :statetype="statenum"
                ></StatementInput></el-tab-pane>
            <el-tab-pane label="购房补贴协议" name="5">
                <StatementInput  v-if="statenum==='5'"
                                 :statetype="statenum"
                ></StatementInput></el-tab-pane>
            <el-tab-pane label="看房直通车免责申明" name="6">
                <StatementInput v-if="statenum==6"
                                :statetype="statenum"
                ></StatementInput>
            </el-tab-pane>
        </el-tabs>

    </div>
</template>
<script>
    /*添加弹框引入*/
    import StatementInput  from '../components/StatementInput'
    export default {
        name: "Statement",
        components:{
            StatementInput,
        },
        data() {
            return {

                /*标签*/
                statenum:this.$store.state.StatementNum.statenum,
                /* inputVisible: false,
                 inputValue: '',*/

            };
        },
        computed:{
          /*  statenum(){return  this.$store.state.StatementNum.statenum}*/

        },
        methods: {
            changeStatement(tab) {
                 console.log(tab.paneName);
            this.$store.dispatch('saveStateNum',this.statenum)

            },

        },

    }
</script>

<style lang="less">
    .clear::after{
        content:'';
        display: block;
        clear: both;
    }
    #state-config{
        .sys-content-head{
            margin: 20px 0;
        }
        .el-tabs__nav-wrap::after{
            background-color: rgba(255, 255, 255, 0);

        }
        .el-tabs__item.is-active{
            color: #ffaa00;
        }.el-tabs__active-bar{
             background-color: #ffaa00;
         }
        .el-tabs__item:hover{
            color: #ffaa00;
        }
        .sys-content-head{
            margin: 20px 0;
        }


    }

</style>